<template>
    <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="item in imgs" :key="item.bannerid">
            <img :src="item.img"  class="swipe_img">
        </van-swipe-item>

    </van-swipe>
</template>
<script>
export default {
    data() {
        return {
            imgs: [
                {
                    "img": "https://img1.baidu.com/it/u=1300668939,1504410366&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=858",
                    "alt": "213",
                    "link": "https://img1.baidu.com/it/u=1300668939,1504410366&fm=253&fmt=auto&app=120&f=JPEG?w=500&h=858",
                    "bannerid": "banner_ca291465-9cc2-4650-9fad-d57a8304277e",
                    "flag": true
                },
                {
                    "img": "https://img0.baidu.com/it/u=2631815445,1952611015&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800",
                    "alt": "3456",
                    "link": "1111",
                    "bannerid": "banner_a0844eb6-1b7c-424d-8682-41a41ed9e0e6",
                    "flag": true
                }
            ]
        }
    },
    created(){
        this.$http.get("/banner/list")
        .then(res=>{
            if(res.data.code==="200"){
                this.imgs = res.data.data;
            }
        })
    }

}
</script>
       
<style scoped>
.my-swipe .van-swipe-item {
    width: 100%;
    height: 12.5rem;
    color: #fff;
    font-size: 20px;
    line-height: 150px;
    text-align: center;
    background-color: #39a9ed;
}
.swipe_img{
    width: 100%;
    height: 100%;
}
</style>